<!DOCTYPE html>
<html lang="en">
<head>
    <script src="static/js/jquery-3.4.1.min.js"></script>
    <script src="static/layui/layui.js"></script>
    <link rel="stylesheet" href="static/layui/css/layui.css">
    <style>
        .layui-table-tool{
          dispaly: none
        }
        #test10{
          width: 290px;
        }
        .layui-input-inline{
          width: auto !important;
          min-width: 190px !important;
        }
    </style>
</head>
<body>

<div class="layui-form">
    <div class="layui-form-item">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="test10" placeholder="请选择发送时间" readonly="readonly">
            </div>
            <#--  <div class="layui-input-inline">
                <select name="type" lay-verify="" id="type" lay-filter="type">
                    <option value="">请选状态</option>
                    <option value="1">待审核</option>
                    <option value="2">待派发</option>
                </select>
            </div>  -->
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="taskId" placeholder="请输入任务ID">
            </div>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="ticketId" placeholder="请输入卡券ID">
            </div>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="mobile" placeholder="请输入用户手机号">
            </div>
            <div class="layui-input-inline">
                <button class="layui-btn" id="search">查询</button>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            当前审核开关状态：<span id="status"></span>
        </div>
        <div class="layui-inline">
            <button class="layui-btn" id="cancel">撤销审批</button>
            <button class="layui-btn" id="pass">通过</button>
            <button class="layui-btn" id="nopass">不通过</button>
            <button class="layui-btn" id="all-pass">全部通过</button>
            <button class="layui-btn" id="all-nopass">全部不通过</button>
            <button class="layui-btn" id="sendTicket">派发卡券</button>
        </div>
    </div>
</div>

<script type="text/javascript">
        var data1='${approve_status}';
        data1 = data1 == 1? "开" : "关";
        if(data1 == "开"){
            $("#status").html(data1).css("color","green");
        }else{
            $("#status").html(data1).css("color","red");
        }
        
</script>
<script type="text/html" id="state">
    {{d.status = d.status == 1 ? "待审核" : d.status == 0 ? "不通过" : d.status == 2 ? "待派发" : "异常状态"}}
</script>
<table class="layui-hide" id="dept-table" lay-filter="dept-table"></table>
<div id="page"></div>
<script>
    var returnData;
    var dataList={};
    layui.use(['table','laydate','util'], function(){
        var table = layui.table;
        var laydate = layui.laydate;
        var laypage = layui.laypage;
        var util = layui.util;
        var taskId = $("#taskId").val() == '' ? null : $("#taskId").val();
        var ticketId = $("#ticketId").val() == '' ? null : $("#ticketId").val();
        var mobile = $("#mobile").val() == '' ? null : $("#mobile").val();
        table.render({
            elem: '#dept-table',
            url:'${request.contextPath}/approve',
            parseData: function (res) {
                return {
                    "code": 0,
                    "msg": "",
                    "count": res.size,
                    data: res.data
                };
            }
            ,cols: [[
                {type:'checkbox'},

                {field:'created_time', width:180, title: '创建时间',
                    templet: function (d) {
                        return util.toDateString(d.created_time, "yyyy-MM-dd HH:mm:ss")
                    }},
                {field:'mobile', width:160, title:'领奖手机号'},
                {field:'status', width:120, title:'状态',templet: '#state'},
                {field:'task_id', width:160, title:'任务ID'},
                {field:'task_name', width:160, title:'任务名称'},               
                {field:'ticket_id', width:120, title:'卡券ID'},
                {field:'name', width:160, title:'卡券名称'},
                {field:'order_id', width:160, title:'订单ID'},
                {field:'bus_count', width:160, title:'公交次数'},
                <#--  {field:'send_time', width:180, title: '发送时间',
                templet: function (d) {
                    return util.toDateString(d.send_time, "yyyy-MM-dd HH:mm:ss")
                }},  -->
                {field:'id', width:80, title: 'ID'}
            ]]
            ,id: 'ids'
            ,page: true,
            <#--  where:{
                taskId: taskId,
                ticketId: ticketId,
                mobile: mobile
            }  -->
        });
        //日期时间范围
        var ins1 = laydate.render({
            elem: '#test10'
            ,type: 'datetime'
            ,range: true
            ,ready: function(value){
              $(".layui-laydate-footer [lay-type='datetime'].laydate-btns-time").click();
              // 改变结束时间默认值
              $(".laydate-main-list-1 .layui-laydate-content li ol li:last-child").click();
              $(".layui-laydate-footer [lay-type='date'].laydate-btns-time").click();
            }
        });
        table.on('checkbox(dept-table)', function (obj) {
            var data = obj.data; //获得当前行数据
            <#--  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象  -->
        });
    });

    //按钮点击查询事件
    $("#search").click(function(){

        var table = layui.table;
        var type = $("#type").val();
        var time = $("#test10").val();
        var taskId = $("#taskId").val() == '' ? null : $("#taskId").val();
        var ticketId = $("#ticketId").val() == '' ? null : $("#ticketId").val();
        var mobile = $("#mobile").val() == '' ? null : $("#mobile").val();
        var startTime = '';
        var createdTime = '';
        <#--  var dataList = {};  -->
        if(time != '' && type != ''){//根据时间和申诉状态查询
            startTime = StringToDate(time.substring(0,19));
            endTime = StringToDate(time.substring(22,42));
            dataList = {
                startTime : startTime,
                createdTime : endTime,
                status : type,
                taskId: taskId,
                ticketId: ticketId,
                mobile: mobile
                };

            table.reload("ids",{
                url: '${request.contextPath}/approve',
                where: dataList,
                page:{
                    curr:1
                },
                done: function(res){
                    this.where={};
                    <#--  page(res,dataList);  -->
                }
            });           
        }else if(time == '' && type != ''){
            dataList={
                taskId: taskId,
                ticketId: ticketId,
                mobile: mobile,
                status: type
            };
            table.reload("ids",{
                url: '${request.contextPath}/approve',
                where: dataList,
                page:{
                    curr:1
                },
                done: function(res){
                    this.where={};
                    <#--  page(res,dataList);  -->
                }
            });
        }else if(time != '' && type == ''){
            startTime = StringToDate(time.substring(0,19));
            endTime = StringToDate(time.substring(22,42));
            dataList={
                startTime : startTime,
                createdTime : endTime,
                taskId: taskId,
                ticketId: ticketId,
                mobile: mobile
            };
            table.reload("ids",{
                url: '${request.contextPath}/approve',
                where: dataList,
                page:{
                    curr:1
                },
                done: function(res){
                    this.where={};
                    <#--  page(res,dataList);  -->
                }
            });
        }else{//查询所有数据
            dataList = {
                taskId: taskId,
                ticketId: ticketId,
                mobile: mobile
            };
            table.reload('ids',{
                url: '${request.contextPath}/approve',
                where: dataList,
                page:{
                    curr:1
                },
                done: function(res){
                    this.where={};
                    <#--  page(res,dataList);  -->
                    returnData = dataList;
                }
            });
        }                    
    });

    function StringToDate(s) {//字符串转日期
        var d = new Date(); 
        d.setYear(parseInt(s.substring(0,4),10)); 
        d.setMonth(parseInt(s.substring(5,7)-1,10)); 
        d.setDate(parseInt(s.substring(8,10),10)); 
        d.setHours(parseInt(s.substring(11,13),10)); 
        d.setMinutes(parseInt(s.substring(14,16),10)); 
        d.setSeconds(parseInt(s.substring(17,19),10));
        return d; 
    }

    // 派发卡券
    $("#sendTicket").click(function(){

        $.ajax({
            url: '${request.contextPath}/test/grantCardToAll',
            type: 'post',
            dataType: 'json',
            traditional: true,
            success: function(res){
                $(".layui-laypage-btn")[0].click();
                if(res.msg == "ok"){
                    parent.layer.alert("操作成功！", {icon: 1, skin: 'layui-layer-molv'});
                }
            }
        });


    });

    //通过按钮
    $("#pass").click(function(){
        var url = '${request.contextPath}/pass';
        approve(url);
    });
    //不通过按钮
    $("#nopass").click(function(){
        var url = '${request.contextPath}/nopass';
        approve(url);
    });
    //全部通过按钮
    $("#all-pass").click(function(){
        var url = '${request.contextPath}/pass';
        var str = "确认要将所有数据改为 待派发 状态？";
        allApprove(url,str);       
    });
    //全部不通过
    $("#all-nopass").click(function(){
        var url = '${request.contextPath}/nopass';
        var str = "确认要将所有数据改为 不通过 状态？";
        allApprove(url,str);       
    });
    //撤销
    $("#cancel").click(function(){
        var table = layui.table;
        var checkStatus = table.checkStatus('ids');
        var url = '${request.contextPath}/cancel';
        var str = "确认要将所有数据改为 待审批 状态？";
        if(checkStatus.data.length > 0){
            //自定义撤销
            approve(url);
        }else{
            //全部撤销
            allApprove(url,str);
        }
    });
    //审核公用方法
    function approve(url){
        var ids = [];
        var table = layui.table;
        var checkStatus = table.checkStatus('ids');
        <#--  console.log(checkStatus.data) //获取选中行的数据
        console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
        console.log(checkStatus.isAll ) //表格是否全选  -->
        var arr = checkStatus.data;
        arr.forEach(function(value,index,array){
            ids.push(value.id);
        });
        if(ids.length>0){
            $.ajax({
                url: url,
                data: {ids:ids},
                type: 'post',
                dataType: 'json',
                traditional: true,
                success: function(res){
                    $(".layui-laypage-btn")[0].click();
                    parent.layer.alert(res.msg, {icon: 1, skin: 'layui-layer-molv'});
                }
            });
        }else{
            layer.alert("请至少选中一条记录！");
        }
    }
    //全部审核公用方法
    function allApprove(url,str){
        layer.confirm(str,{
            btn: ["确定","取消"]
        },function(index){
            var ids = [];
            $.ajax({
                url: '${request.contextPath}/getAllId',
                success: function(res){
                    ids = res.data;
                    $.ajax({
                        url: url,
                        data: {ids:ids},
                        type: 'post',
                        dataType: 'json',
                        traditional: true,
                        success: function(res){
                            layer.close(index);
                            $(".layui-laypage-btn")[0].click();
                            parent.layer.alert(res.msg, {icon: 1, skin: 'layui-layer-molv'});
                        }
                    });
                }
            });
        },function(){
        }
        );       
    }
</script>
</body>
</html>